<template>
  <div style="background-color: rgb(242, 242, 242)">
    <homeHead :showLeft="true" name="推荐向我"></homeHead>
    <div class="list-header">
      <mt-loadmore
        :bottom-method="loadBottom"
        :auto-fill="false"
        :bottom-all-loaded="allLoaded"
        ref="loadmore"
      >
        <list :items="listData2" :infoType="infoType"></list>
      </mt-loadmore>
      <p v-if="allLoaded == true" style="text-align: center">暂无更多数据</p>
      <p v-else style="text-align: center">上拉加载更多</p>
    </div>
  </div>
</template>

<script>
import homeHead from "./head.vue";
import list from "./reCommendList.vue";
import { getToMeList } from "../../api/mine";

export default {
  data() {
    return {
      allLoaded: false,
      listData: [],
      listData2: [],
      allPage: "",
      infoType: "RecommendationToMe",
      postData: {
        pageIndex: 1,
        pageSize: 12,
        infoType: "RecommendationToMe",
      },
    };
  },
  created() {
   
  },
  mounted() {
    this.getList();
  },
  methods: {
    // 获取我的收藏数据列表
    getList() {
      getToMeList(this.postData).then((res) => {
        this.listData = JSON.parse(res.data.data);
        this.listData2 = this.listData2.concat(this.listData);
        // 总条数
        var total = res.data.DataCount;
        // 总页数
        this.allPage = Math.ceil(total / this.postData.pageSize);
        if (this.postData.pageIndex < this.allPage) {
          this.allLoaded = false;
        } else {
          //控制是否可以滑动
          this.allLoaded = true;
        }
      });
    },
    // 上拉刷新
    loadBottom() {
      if (this.postData.pageIndex < this.allPage) {
        this.postData.pageIndex += 1;
        this.getList();
        this.$refs.loadmore.onBottomLoaded();
      }
    },
  },
  components: {
    homeHead: homeHead,
    list: list,
  },
};
</script>
<style lang="scss" scoped>
.list-header {
  min-height: calc(100vh - 120px);
  background: #fff;
  overflow-x: hidden;
  margin-top: 60px;
}
</style>